<template>
    <div class="con_box">
        <!-- 搜索栏目开始
        <div class="search_column">
            <el-form ref="searchForm" :inline="true" :model="table.queryParams" label-width="95px" size="mini">
                <el-form-item label="轮播图：">
                    <el-input v-model="table.queryParams.keyWord"></el-input>
                </el-form-item>
                <el-form-item label="">
                    <el-button type="primary" size="small" icon="el-icon-search" @click="searchSubmit">查 询</el-button>
                    <el-button type="primary" size="small" icon="el-icon-refresh" @click="resetSubmit(table.queryParams)">重置</el-button>
                </el-form-item>
            </el-form>
        </div> -->
        <!-- 搜索栏目结束 -->
        <!-- 操作栏开始 -->
        <!-- <div class="btns_column clearfix">
            <div class="fl">
                <el-button type="primary" size="mini" icon="el-icon-plus" @click="handleMethod">添加活动</el-button>
            </div>
            <div class="fr"> -->
                <!--  <a v-has="'student:import'" href="javascript:void(0)" @click="downloadTemplate" class="link_txt">
                    下载导入模板
                </a> -->
           <!--   </div>
        </div> -->
        <!-- 操作栏结束 -->
        <vue-table 
            :api-url="table.apiUrl" 
            :fields="table.fields" 
            :appendParams="table.queryParams" 
            :content="self" ref="tableList">
        </vue-table>


        <!-- <add-dialog ref="addDialog"></add-dialog>
        <detail-dialog ref="detailDialog"></detail-dialog> -->
    </div>
</template>

<script>
    import add_dialog from "./add_dialog"
    import detail_dialog from "./detail_dialog"
    import moment from 'moment'
    export default {
        components: {
            "add-dialog": add_dialog,
            "detail-dialog": detail_dialog,
        },
        data() {
            return {
                self: this,
                show:false,
                table: {
                    apiUrl: api.circleManagement.circleList,
                    queryParams: {
                        typeId: ''
                    },
                    fields: [{
                            prop: "__index",
                            width: "60",
                            label: "序号",
                        },
                         {
                            prop: "title",
                            width: "150",
                            label: "标题",
                        },
                        {
                            prop: "user.lastName",
                            label: "作者姓名",
                        },
                        {
                            prop: "created",
                            label: "发布时间",
                            formatter : function(row, column, cellValue){                                
                                if(cellValue){
                                    if(cellValue){
                                        return moment(cellValue).format('YYYY-MM-DD')
                                    }
                                }
                            }
                        },
                        {
                            prop: "likeSize",
                            label: "点赞数",
                        },
                        {
                            prop: "description",
                            width: "150",
                            label: "描述",
                        },
                        {
                            prop: "__action",
                            label: "操作",
                            width: 100,
                            actions: [
                                {
                                    label: "编辑",
                                    type: "edit",
                                    func: function(vm, row) {
                                        vm.$refs.detailDialog.showDialog(row);
                                    }
                                },
                                {
                                    label: "删除",
                                    type: "delete",
                                    func: function(vm, row) {
                                        vm.deleteMethod(row.id);
                                    }
                                }
                            ]
                        }
                    ],
                },
            }
        },
        methods: {
            // 查询
            searchSubmit() {
                this.$refs.tableList.$emit('vuetable:refresh');
            },
            //重置
            resetSubmit(val) {
                for (var key in val) {
                    val[key] = '';
                }
                this.$refs.tableList.$emit('vuetable:refresh');
            },
            // 添加
            handleMethod() {
                this.$refs.addDialog.showDialog();
            },
            // 删除用户
            deleteMethod(id) {
                let vm = this;
                vm.$confirm('是否删除该条记录！', '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    })
                    .then(() => {
                        // vm.axios.delete(api.circleList.circleList+'/'+id)
                        // .then((response) => {
                        //     if(response.data.code == 200){
                        //         vm.$message.success(response.data.data.message);
                        //         vm.$refs.tableList.$emit('vuetable:current-refresh');
                        //     }else{
                        //         vm.$message.error(response.data.message);
                        //     }
                        // });
                    }, () => {})
            },
        },
        watch: {
            // 检测路由地址变化，触发vue-table的更新
            '$route' (to, from) {
                this.table.queryParams.typeId = this.$store.state.circleList[_.last(this.$route.path.split("/"))];
                this.$refs.tableList.$emit('vuetable:refresh');
            }
        },
        created(){
            // 获取当前页面的typeId
            this.table.queryParams.typeId = this.$store.state.circleList[_.last(this.$route.path.split("/"))];
        },
        mounted() { }
    }
</script>